{% extends 'layout/main.html' %}

{% block main %}

<div id="main" class="main-container container">



<div class="row">
  <div class="col-md-9">
    <div class="topic-detail panel panel-default">
      <div class="panel-heading media clearfix">
  <div class="media-body">
    <h1 class="media-heading">{{detail.title}}</h1>
    <div class="info">
      <a class="node" href="/topics/node3">{{detail.node_name}}</a>
       ·
      <a data-author="true" data-name="Eric-Guo" href="/ericguo">{{detail.author_username}}</a>
       ·
      于 <abbr class="timeago" title="2015-12-12T22:52:23+08:00">6 天前</abbr>发布
         ·
        最后由 <a data-name="shin" href="/shin">shin</a> 于 <abbr class="timeago" title="2015-12-19T19:50:48+08:00">3 小时前</abbr>回复
       ·
      407 次阅读
    </div>
  </div>
  <div class="avatar media-right">
    <a href="/ericguo"><img class="media-object avatar-48" src="https://ruby-china-files.b0.upaiyun.com/user/large_avatar/1665.jpg" alt="1665"></a>
  </div>
</div>

      <div class="panel-body markdown">


        <article>
          {{detail.content}}
        </article>



        <div class="social-share-button" data-title="微信网页 UI 现在有新的 Gem，weui-rails via: @ruby_china " data-img="" data-url="">
<a rel="nofollow " data-site="twitter" class="social-share-button-twitter" onclick="return SocialShareButton.share(this);" title="分享到Twitter" href="#"></a>
<a rel="nofollow " data-site="facebook" class="social-share-button-facebook" onclick="return SocialShareButton.share(this);" title="分享到Facebook" href="#"></a>
<a rel="nofollow " data-site="google_plus" class="social-share-button-google_plus" onclick="return SocialShareButton.share(this);" title="分享到Google+" href="#"></a>
<a rel="nofollow " data-site="weibo" class="social-share-button-weibo" onclick="return SocialShareButton.share(this);" title="分享到新浪微博" href="#"></a>
<a rel="nofollow " data-site="douban" class="social-share-button-douban" onclick="return SocialShareButton.share(this);" title="分享到豆瓣" href="#"></a>
</div>
      </div>


      <div class="panel-footer clearfix">
        <div class="opts">
  <a class="" href="/account/sign_in"><i class="fa fa-thumbs-up"></i> <span></span></a>


  <span class="pull-right opts">
  </span>
</div>

      </div>
    </div>



    <div id="replies" class="panel panel-default" data-last-floor="5">
      <div class="total panel-heading">
        共收到 <b>5</b> 条回复
      </div>
      <div class="items panel-body">

          <div class="reply" id="reply1">
    <div class="avatar"><a href="/xworm"><img class="media-object avatar-48" src="https://ruby-china-files.b0.upaiyun.com/user/large_avatar/3035.jpg" alt="3035"></a></div>
    <div class="infos">
      <div class="info">
        <span class="name">
          <a data-name="某虫" href="/xworm">xworm</a>
        </span> ·
        <span class="time">
          <a class="reply-floor" href="#reply1">#1</a> · <abbr class="timeago" title="2015-12-12T23:10:55+08:00">6 天前</abbr>
        </span>
        <span class="opts pull-right">
            <a title="赞" data-count="0" data-state="" data-type="Reply" data-id="282987" class="likeable " href="#"><i class="fa fa-thumbs-up"></i> <span></span></a>
            <a class="edit fa fa-pencil" data-uid="3035" title="修改回帖" href="/topics/28367/replies/282987/edit"></a>
            <a data-floor="1" data-login="xworm" title="回复此楼" class="btn-reply fa fa-mail-reply" href="#"></a>
        </span>
      </div>
      <div class="markdown">
        <p>我来 star 第一个<br>
顺便感谢楼主在 wechat 项目上的付出</p>
      </div>
    </div>
</div>
<div class="reply" id="reply2">
    <div class="avatar"><a href="/liwei78"><img class="media-object avatar-48" src="https://ruby-china-files.b0.upaiyun.com/user/large_avatar/3469.jpg" alt="3469"></a></div>
    <div class="infos">
      <div class="info">
        <span class="name">
          <a data-name="里克" href="/liwei78">liwei78</a>
        </span> ·
        <span class="time">
          <a class="reply-floor" href="#reply2">#2</a> · <abbr class="timeago" title="2015-12-13T01:59:42+08:00">6 天前</abbr>
        </span>
        <span class="opts pull-right">
            <a title="赞" data-count="0" data-state="" data-type="Reply" data-id="282999" class="likeable " href="#"><i class="fa fa-thumbs-up"></i> <span></span></a>
            <a class="edit fa fa-pencil" data-uid="3469" title="修改回帖" href="/topics/28367/replies/282999/edit"></a>
            <a data-floor="2" data-login="liwei78" title="回复此楼" class="btn-reply fa fa-mail-reply" href="#"></a>
        </span>
      </div>
      <div class="markdown">
        <p><img src="https://ruby-china-files.b0.upaiyun.com/assets/emojis/plus1.png" class="emoji" title=":plus1:" alt=""> </p>
      </div>
    </div>
</div>
<div class="reply" id="reply3">
    <div class="avatar"><a href="/qinfanpeng"><img class="media-object avatar-48" src="https://ruby-china-files.b0.upaiyun.com/user/large_avatar/3790.jpg" alt="3790"></a></div>
    <div class="infos">
      <div class="info">
        <span class="name">
          <a data-name="qinfanpeng" href="/qinfanpeng">qinfanpeng</a>
        </span> ·
        <span class="time">
          <a class="reply-floor" href="#reply3">#3</a> · <abbr class="timeago" title="2015-12-13T10:56:18+08:00">6 天前</abbr>
        </span>
        <span class="opts pull-right">
            <a title="赞" data-count="1" data-state="" data-type="Reply" data-id="283017" class="likeable " href="#"><i class="fa fa-thumbs-up"></i> <span>1 个赞</span></a>
            <a class="edit fa fa-pencil" data-uid="3790" title="修改回帖" href="/topics/28367/replies/283017/edit"></a>
            <a data-floor="3" data-login="qinfanpeng" title="回复此楼" class="btn-reply fa fa-mail-reply" href="#"></a>
        </span>
      </div>
      <div class="markdown">
        <p>+1</p>
      </div>
    </div>
</div>
<div class="reply" id="reply4">
    <div class="avatar"><a href="/dingyiming"><img class="media-object avatar-48" src="https://ruby-china-files.b0.upaiyun.com/user/large_avatar/23844.jpg" alt="23844"></a></div>
    <div class="infos">
      <div class="info">
        <span class="name">
          <a data-name="丁一鸣" href="/dingyiming">dingyiming</a>
        </span> ·
        <span class="time">
          <a class="reply-floor" href="#reply4">#4</a> · <abbr class="timeago" title="2015-12-13T15:35:25+08:00">6 天前</abbr>
        </span>
        <span class="opts pull-right">
            <a title="赞" data-count="0" data-state="" data-type="Reply" data-id="283032" class="likeable " href="#"><i class="fa fa-thumbs-up"></i> <span></span></a>
            <a class="edit fa fa-pencil" data-uid="23844" title="修改回帖" href="/topics/28367/replies/283032/edit"></a>
            <a data-floor="4" data-login="dingyiming" title="回复此楼" class="btn-reply fa fa-mail-reply" href="#"></a>
        </span>
      </div>
      <div class="markdown">
        <p>赞+1</p>
      </div>
    </div>
</div>
<div class="reply" id="reply5">
    <div class="avatar"><a href="/shin"><img class="media-object avatar-48" src="https://ruby-china-files.b0.upaiyun.com/user/large_avatar/296.jpg" alt="296"></a></div>
    <div class="infos">
      <div class="info">
        <span class="name">
          <a data-name="Shin" href="/shin">shin</a>
        </span> ·
        <span class="time">
          <a class="reply-floor" href="#reply5">#5</a> · <abbr class="timeago" title="2015-12-19T19:50:48+08:00">3 小时前</abbr>
        </span>
        <span class="opts pull-right">
            <a title="赞" data-count="0" data-state="" data-type="Reply" data-id="283766" class="likeable " href="#"><i class="fa fa-thumbs-up"></i> <span></span></a>
            <a class="edit fa fa-pencil" data-uid="296" title="修改回帖" href="/topics/28367/replies/283766/edit"></a>
            <a data-floor="5" data-login="shin" title="回复此楼" class="btn-reply fa fa-mail-reply" href="#"></a>
        </span>
      </div>
      <div class="markdown">
        <p>＋1</p>
      </div>
    </div>
</div>

      </div>
    </div>
    {% if current_user %}
      <div class="alert alert-success"><a href="#" data-dismiss="alert" class="close">X</a>回复成功。</div>
      <div class="panel panel-default" id="reply">
      <div class="panel-heading">回帖</div>
      <div class="panel-body">

        <div class="editor-toolbar">
  <div class="opts pull-right">
    <span id="editor-toolbar-insert-code" class="dropdown dropdown-small">
      <a title="插入代码" data-toggle="dropdown" href="#editor-toolbar-insert-code"><i class="fa fa-code"></i></a>
      <ul role="menu" class="dropdown-menu insert-codes">
        <li><a href="#" data-lang="ruby">Ruby</a></li><li><a href="#" data-lang="erb">HTML / ERB</a></li><li><a href="#" data-lang="scss">CSS / SCSS</a></li><li><a href="#" data-lang="js">JavaScript</a></li><li><a href="#" data-lang="yml">YAML <i>(.yml)</i></a></li><li><a href="#" data-lang="coffee">CoffeeScript</a></li><li><a href="#" data-lang="conf">Nginx / Redis <i>(.conf)</i></a></li><li><a href="#" data-lang="python">Python</a></li><li><a href="#" data-lang="php">PHP</a></li><li><a href="#" data-lang="java">Java</a></li><li><a href="#" data-lang="erlang">Erlang</a></li><li><a href="#" data-lang="shell">Shell / Bash</a></li>
      </ul>
    </span>
    <a href="#" title="" rel="twipsy" id="topic-upload-image" data-original-title="上传图片"><i class="fa fa-fa fa-image"></i> </a>
  </div>
  <ul style="clear:none;" class="nav nav-pills">
    <li class="edit active"><a href="#">编辑</a></li>
    <li class="preview"><a href="#">预览</a></li>
  </ul>
</div>

        <form method="post" data-remote="true" accept-charset="UTF-8" action="/topics/28415/replies" id="new_reply" class="new_reply"><input type="hidden" value="✓" name="utf8">

          <div class="form-group">
            <div class="topic-editor-dropzone dz-clickable"><textarea id="reply_body" name="reply[body]" tabindex="1" rows="4" class="topic-editor form-control" style="height: 97px;"></textarea></div><div id="preview" class="markdown form-control" style="display: none;"></div>
          </div>
          <div class="submit-buttons">
            <button tabindex="2" class="btn btn-primary" id="reply-button" type="submit">提交回复</button>
            <span title="或者 Ctrl + Enter" style="padding-left: 5px;" class="help-inline"><kbd>Command</kbd> + <kbd>Enter</kbd></span>

            <div class="pull-right"><a target="_blank" href="/markdown">排版说明</a></div>
          </div>
</form>      </div>
    </div>
      {% else %}
    <div class="panel panel-default">
      <div class="panel-body">
        <div id="reply" class="form box">
    <div style="padding:20px;">
    需要 <a class="btn btn-primary" href="/account/sign_in">登录</a> 后回复方可回复, 如果你还没有账号你可以 <a class="btn btn-danger" href="/account/sign_up">注册</a> 一个帐号。
    </div>
</div>
      </div>
    </div>
      {% endif %}
  </div>

  <div class="sidebar hidden-mobile col-md-3">
    <div id="topic-sidebar">
  <div class="panel panel-default">
    <div class="panel-body">
      <a href="#" class="btn btn-block btn-move-page" data-type="top"><i class="fa fa-arrow-up"></i></a>
      <div class="buttons">
        <div class="group likes opts">
          <a class="" href="/account/sign_in"><i class="fa fa-thumbs-up"></i> <span></span></a>
        </div>
        <div class="group">
          <div class="btn-group" role="group">


          </div>
        </div>
      </div>

      <hr>
      <div class="reply-buttons">
        <div class="total">
          共收到 <b>5</b> 条回复
        </div>
        <a href="#reply" class="btn btn-success btn-block btn-focus-reply">参与回复</a>
      </div>
      <hr>
      <div class="group opts">

      </div>
      <a href="#" class="btn btn-block btn-move-page" data-type="bottom"><i class="fa fa-arrow-down"></i></a>
    </div>
  </div>
</div>

  </div>
</div>

  </div>

{% endblock %}